<template>
<div class="main">
<ul>
    <li class="item" v-for="(item,i) in subjectList" :key="item">
       <h4>{{i+1}}.[{{item.type | fmtSubjectType}}]{{item.title}}</h4> 
       <div style="color:#888;font-size:14px;padding:10px 0">{{item.author}} {{item.createTime}}</div>
       <fieldset style="padding:10px" v-if="checkisXZT(item.type)">
           <legend>选项</legend>
           <div v-for="(option,i) in item.options" :key="option">{{i | fmtOrder2ABC}}.{{option.val}}</div>
       </fieldset> 
       <div v-if="checkisXZT(item.type)">答案：{{item.answer1}}</div>
       <div v-else>答案：{{item.answer2}} </div>
       <div>解析：{{item.desc}}</div>
    </li>
</ul>
</div>
</template>
<script>

import { createNamespacedHelpers } from "vuex"
let { mapMutations,mapState } = createNamespacedHelpers('subject');
export default {
    computed: {
        ...mapState(["subjectList"])
    },
   async created() {
      let {subjectList}  =await this.$get("/subjectlist")
    this.setSubjectList(subjectList)
    },
    methods: {
        ...mapMutations(["setSubjectList"])
    },
}
</script>
<style lang="scss">
.main {
    width: 500px;
    margin: 0 auto;
    border: 1px solid red;
    .item{
        padding: 10px;
        border-bottom: 1px solid #ccc;
    }
}
</style>